{% extends 'PHPDishWebBundle::layout.html.twig' %}

{% block title %} {{ category.name }} {% endblock %}

{% block script %}
    <script type="text/javascript" src="{{ asset('build/js/category.js') }}"></script>
{% endblock %}

{% block content %}
<div class="container narrow-layout">
    {% from  'PHPDishWebBundle:Macros:notification.html.twig' import flashes %}
    {{ flashes() }}
    <div class="row">
        <div class="col-md-12">
            <div class="panel panel-u category-detail">
                <div class="panel-heading">
                    <div class="media category">
                        <div class="media-left media-middle">
                            {% set categoryUrl = path('category_view', {'slug': category.slug}) %}
                            <a href="{{ categoryUrl }}" class="avatar">
                                <img src="{{ category.cover|imagine_filter('middle_square') }}" class="media-object img-circle img-responsive"/>
                            </a>
                        </div>
                        <div class="media-body">
                            <div class="pull-right follow-panel" data-role="follow-category" data-slug="{{ category.slug }}">
                                {% if app.user and category.isFollowedBy(app.user) %}
                                    <button class="btn btn-default" data-action="unfollow"><i class="if i-plus"></i> 已订阅</button>
                                {% else %}
                                    <button class="btn u-btn-outline-primary" data-action="follow"><i class="if i-plus"></i> 订阅</button>
                                {% endif %}
                            </div>
                            <h4 class="media-heading">
                                <a class="name" href="{{ categoryUrl }}">{{ category.name }}</a>
                                {% if is_granted('edit', category) %}
                                    <a class="meta" href="{{ path('category_edit', {'slug': category.slug}) }}" title="编辑"><i class="if i-edit"></i> 编辑专栏</a>
                                {% endif %}
                            </h4>
                            <ul class="list-unstyled list-inline meta">
                                <li>文章 {{ category.postCount }}</li>
                                <li>订阅 {{ category.followerCount }}</li>
                            </ul>
                            <div>{{ category.description }}</div>
                        </div>
                    </div>
                </div>
                <ul class="list-unstyled list-inline tab-nav" data-pjax-container="list-container">
                    <li {% if tab == 'new' %} class="active" {% endif %}><a href="{{ path('category_view', {'slug': category.slug}) }}">新发布</a></li>
                    <li {% if tab == 'hot' %} class="active" {% endif %}><a href="{{ path('category_view', {'slug': category.slug, 'orderby': 'hot'}) }}">热门</a></li>
                    <li {% if tab == 'follower' %} class="active" {% endif %}><a href="{{ path('category_followers', {'slug': category.slug}) }}">订阅</a></li>
                </ul>
                <div id="list-container">
                    {% block category_content %}
                        <div class="empty-data">没有任何数据</div>
                    {% endblock %}
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}